<style>
    :not(:defined) {
        display: none;
    }

    /* Force the scroll bar to appear so we see it hide when overlay opens. */
    body::-webkit-scrollbar {
        background: lightgray;
    }

    body::-webkit-scrollbar-thumb {
        background: darkgray;
    }
    #createment_container{
        /* background: #349ACA; */
        color: #fff;
        font-size: 14px;
        width: 600px;
        height: auto;
        /* min-height: 600px; */
        text-align: center;
        padding: 10px;
        position: relative;
    }
    #createment_container h2{
        font-size: 18px;

    }
    h2{
        margin: 0;
        padding: 0;
    }
    #createment_container .item{
        display: flex;
        justify-content: space-between;
        margin: 10px 0;
    }
    #createment_container .item span{
        width: 100px;
       
    }
    #createment_container .item .inputcontent{
        flex: 1;
    }




    
</style>
<elix-dialog id="svg_createment" aria-label="Sample dialog" closed>
    <div id="createment_container">
        <h2>立方体颜色设置</h2>
        <div>
            <span>立方体前方:</span>
            <se-colorpicker id="fill_color_front" src="fill.svg"  type="fill" style="width:100px;height:100%;"></se-colorpicker>
          </div>

    </div>
</elix-dialog>